(function() {
    'use strict';

    /**
     * @ngdoc directive
     * @name webApp.directive:colorAssembly
     * @colorAssembly
     * # 
     */
    angular.module('webApp')
        .directive('colorAssembly', ['dataService', '$compile', '$timeout',
            function(dataService, $compile, $timeout) {
                return {
                    restrict: 'E',
                    // require: 'ngModel',
                    replace: false,
                    scope: {
                        color: '=',
                        backcall: "&",
                        isname: "@",
                        name: "@",
                        changwidth: "="
                    },
                    template: '<div ng-if="changwidth" class="colorAssmbly" style="display:flex;padding:3px 3px;border:1px solid #D6DBE1;width: 165px;"><div color-picker default-color="{{color?color:" #ff0000 "}}" class="font-color" style="width:140px;border:0px;height:16px;line-height:16px;" ng-style="{\'background-color\': color}"></div><img src="../app/assets/zhuangxiu_model/color.png" style="width:17px;height:17px;margin-left:5px;" color-picker /></div><div class="colorAssmbly" style="width:20px" ng-if="!changwidth"><div color-picker default-color="{{color?color:" #ff0000 "}}" class="font-color" style="width:20px !important;border:0px;height:20px;line-height:20px;" ng-style="{\'background-color\': color}"></div></div>',
                    link: function(scope) {
                        if (!scope.color) {
                            scope.color = '#f00';
                        }

                        scope.$on('colorPicked', function(event, color) {
                            // console.error("event",event);
                            scope.color = color;
                            scope.backcall({
                                isname: scope.isname,
                                name: scope.name,
                                color: scope.color
                            });
                        });
                    }
                }
            }
        ])

})();